<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
    <!--<div th:insert="static/thymeleafInclude::head"></div>-->
</head>
<body>
<div>
    <span style="color: red">打开thymeleaf</span>
    <div>
        <span th:text="${template.templateLayoutName}"></span>
    </div>
    <div th:if="${not #lists.isEmpty(templateList)}">
        <div>
            <ul class="list-group">
                <li class="list-group-item" th:each="templa:${templateList}">
                    <span th:text="${templa.templateLayoutName}"></span>
                    <span th:text="${templa.templateLayoutCode}"></span>
                    <button class="btn" th:onclick="'getName(\''+${templa.templateLayoutName}+'\');'">获得名字</button>
                </li>
            </ul>
        </div>
    </div>

</div>

<!--基本引入-->
<!--<script type="text/javascript" th:src="@{/jquery-3.3.1.js}"></script>-->
<!--模板引入:两种都可以-->
<!--<script type="text/javascript" th:include="thymeleafInclude::foot"></script>-->
    <div th:include="thymeleafInclude::foot"></div>

    <!-- js获取后台数据 -->
    <script th:inline="javascript">
        var single = [[${template}]];
        console.log(single.templateLayoutName+":"+single.templateLayoutCode);
    </script>

    <script type="text/javascript">
        $(function () {
            console.log("可以使用jQuery")
        });
        function getName(name) {
            console.log(name)
        }
    </script>

</body>

</html>